<template>
	<view class="list">
		<view class="status_bar">
			<!-- 这里是状态栏 -->
		</view>
		<view class="navTitle">
			
			<view class="titleText">
				<img src="~/static/icon/back.png" @tap="goBack()">
				<text>电影</text>
			</view>

			<scroll-view scroll-x="true" class="bg-white nav" scroll-with-animation :scroll-left="scrollLeft">
				<view class="cu-item" v-for="(item,index) in classifyList" :key="index" :class="{active:index == num}" @tap="tabSelect(index,item)"
				 :data-id="index">
					{{item.type_name}}
				</view>
			</scroll-view>
		</view>

		<!-- 榜单列表 -->
		<view class="con">
			<view class="load1">
				<view class="content" v-for="(items,index) in movieList" :key="index" @tap="getInfo(items)">
					<view class="content-img">
						<image :src="items.vod_pic" mode="aspectFill" lazy-load="true"></image>
					</view>
					<view class="content-icon">
						<!-- <img src="~/static/icon/b4.png"> -->
						<i>{{index+1}}</i>
					</view>
					<view class="content-score">
						{{items.vod_score}}分
					</view>
					<view class="content-mes">
						<view class="dramaName">
							{{items.vod_name}}
						</view>
						<view class="dramaType">
							电影<span>|</span>剧情<span>|</span>2019
							<p>主演：张一山 王仁君 王志飞 胡平 海波</p>
						</view>
						<view class="dramaCol" v-if="noCollected" @tap="isCollected">
							<img src="~/static/icon/follow.png">
							<text>收藏</text>
						</view>
						<view class="noDramaCol" v-else @tap="noCollected">
							<text>已收藏</text>
						</view>
					</view>
				</view>

				<view class="loading" v-if="isLoading">
					<ul>
						<li></li>
						<li></li>
					</ul>
				</view>
			</view>


		</view>
	</view>
</template>

<script>
	var page = 1;
	export default {
		data() {
			return {
				num: 0,
				isCollected: false,
				scrollLeft: 120,
				noCollected: true,
				noCollected1: true,
				isLoading: true,
				movieList: [],
				classifyList: [],
				typeid1:'',
				topTitle:''
			}
		},
		onLoad:function(option) {
			// console.log(option);
			this.num = option.index;
			let typeid1 = option.typeid1;
			this.typeid1 = typeid1;
			console.log(typeid);
			if(typeid1==1){
				this.topTitle = "电影"
			}
			if(typeid1==2){
				this.topTitle = "电视剧"
			}
			let typeid = option.typeid;
			uni.request({
				url: 'http://221.234.36.126:82/api.php/Login/visitor_login',
				method: 'POST',
				data: {
					token: '1CECE2221211DDCB613882C3311EC670'
				},
				header: {
					'content-type': 'application/json;charset=UTF-8'
				},
				success: (res) => {
					// console.log(res);
					let visitor = res.data.data.hash;
					uni.request({
						url: 'http://221.234.36.126:82/api.php/Vod/order_video',
						method: 'POST',
						data: {
							token: '1CECE2221211DDCB613882C3311EC670',
							hash: visitor,
							type_id_1: typeid1,
							type_id: typeid
						},
						header: {
							'content-type': 'application/json;charset=UTF-8'
						},
						success: (res) => {
							// console.log(res.data);
							this.movieList = res.data.list;
							this.classifyList = res.data.cate_child;
						}
					})
				}
			});
		},
		onReachBottom() {
			let _self = this
			page++

			uni.request({
				url: 'http://221.234.36.126:82/api.php/Vod/order_video',
				method: 'POST',
				data: {
					token: '1CECE2221211DDCB613882C3311EC670',
					page: page,
					type_id_1: 1,
				},
				header: {
					'content-type': 'application/json;charset=UTF-8'
				},
				success: (res) => {
					// console.log(res.data)
					if (res.data.list == "") {
						uni.hideNavigationBarLoading();
						_self.isLoading = false;
						return false;
					}
					_self.movieList = _self.movieList.concat(res.data.list);
					uni.hideNavigationBarLoading();
				}
			})
		},
		methods: {
			tabSelect(index, item) {
				var that = this
				this.num = index
				let id = item.type_id

				uni.request({
					url: 'http://221.234.36.126:82/api.php/Vod/order_video',
					method: 'POST',
					data: {
						token: '1CECE2221211DDCB613882C3311EC670',
						// page: page,
						type_id_1: this.typeid1,
						type_id: id
					},
					header: {
						'content-type': 'application/json;charset=UTF-8'
					},
					success: (res) => {
						that.movieList = res.data.list
					}
				})
			},
			// 影片详情页
			getInfo(items) {
				let vodId=items.vod_id
				uni.navigateTo({
					url: '/pages/videoInfo/videoInfo?id='+vodId
				});
			},
			goBack() {
				uni.navigateBack({
					delta: 1
				})
			},
			// 收藏--取消收藏
			toggleCollected() {
				this.isCollected = !this.isCollected
				this.noCollected1 = !this.noCollected1
			}
		},
		computed: {
			favoriteText() {
				return this.isCollected ? '已收藏' : '收藏'
			}
		},
	}
</script>

<style>
	@import url("list.css");
</style>
